<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
            "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
	<head>
		<title>List Helper Demo</title>
        <style type='text/css'>
            body {font-family: verdana}
            li {border: solid 1px gray; padding: 5px; width: 250px;}
			li a {color: red; font-weight: bold;}
			p {width: 400px;}
        </style>
	</head>
	<body>
		<a href='javascript://' id='start'>Start</a>
		<div id='items'></div>
		
		
<script type='text/javascript' 
        src='../../../steal/steal.js'>
</script>
<script type='text/javascript' id="demo-source">
steal('jquery/model',
		'jquery/dom/fixture',
		'jquery/model/list','jquery/controller').then(function(){
	var index = 0;
	$.Model("Thing",{
		findAll : function(params, success){
			//return 100000 items
			var items = []
			for(var i = 0; i < 100; i++){
				items.push({
					id: i+1+index,
					name: "name "+i,
					something : "sdfj alsfj als;f j;lsa jf;lsa jf;lsajf ;lsa jf;lsa jf;lsajf ;lsajfoiewjfj ;lsajf",
					other : "asdf asf sadfsad fsadf salkdf j;lsa jf;lkdsa jf;lksa f;lksajf ;lsak jf;laks jflksaj f;lf;ljfdsaljsafd;l as;lk j;lkfsa ja"
				})
			}
			index = i;
			success(this.wrapMany(items))
		}
	},{})
	$.Model.List("Thing.List");
	
	$.Controller("Tester",{
		init : function(){
			var self = this;
			self.timer = setTimeout(function(){
				
				self.options.list.findAll()
				
				self.timer = setTimeout(arguments.callee, 500)
				
			},500)
			
		},
		"{list} add" : function(list, ev, items){
			this.element.html(list.length)
		},
		click : function(){
			clearTimeout(this.timer);
			this.element.remove()
		}
	})
	var timer;
	$('#start').click(function(){
		/*var list = new Thing.List();
		list.bind("add", function(){
			$('#items').html(this.length)
		});
		timer = setTimeout(function(){
				
			list.findAll()
			
			timer = setTimeout(arguments.callee, 500)
			
		},500)
		
		$('#items').one('click',function(){
			clearTimeout(timer);
			list.unbind("add")
		})*/
		$("#items").tester({list : new Thing.List()});
	})
})
</script>
	</body>
</html>